<template>
	<van-popup v-model:show="state.show" position="bottom" :style="{ height: '30%' }">
		<van-date-picker v-model="state.currentDate" :min-date="state.minDate" :max-date="state.maxDate" @confirm="confirm" />
	</van-popup>
</template>

<script setup>
	import { reactive, ref } from 'vue'
	const state = reactive({
		currentDate: ref([String(new Date().getFullYear()), String(new Date().getMonth() + 1), String(new Date().getDate())]),
		show: false,
		minDate: new Date(2000, 0, 1),
		maxDate: new Date(2099, 12, 31),
		fieldName: null,
		obj: {}
	})

	const emit = defineEmits(['confirm'])

	const props = defineProps({

	})

	const start = (obj, fieldName) => {
		state.show = true
		state.obj = obj
		state.fieldName = fieldName
	}

	const confirm = (val) => {
		state.obj[state.fieldName] = val.selectedValues.join("-")
		state.show = false
	}

	defineExpose({
		start
	})
</script>

<style lang="scss" scoped>

</style>